<template>
  <div>
    <h1>商品列表</h1>
    <div style="width: 90%; display: flex; flex-direction: row; justify-content: flex-end; margin: 20px;">
      <el-button type="success">我的购物车</el-button>
      <el-button type="success">我的订单</el-button>
    </div>
    <MyTable ref="myTable" :params="tables"></MyTable>


  </div>
</template>

<script>
import MyTable from "./MyTable"

export default {
  components: {
    MyTable
  },
  data() {
    return {

      //弹出框的属性
      dialogFormVisible: false,
      formLabelWidth: '120px',
      //表单数据
      form: {
        tName: null
      },
      tables: {
        //表头数组
        cols: [
          {prop: "name", label: "商品名称"},
          {prop: "image", label: "商品图片", type: "img"},
          {prop: "price", label: "价格"}
        ],
        request: {
          //表格请求的url
          url: "/newsInfo/list",
          //请求的数据
          data: {}
        },
        actions: [
          {
            btnName: "加入购物车", action: (row) => {
              console.log("加入购物车按钮被点击了....", row);
            }
          }

        ]
      }

    }
  },
  methods: {

    queryProduct() {
      this.$.ajax({
        type: "POST",
        url: "/newsInfo/list",
        seccess: (result) => {
          console.log("请求结果", result);
          this.imageUrl = this.$.getImg(this.form.fengmian);
        }
      });
    }
  },
  mounted() {
    this.queryProduct();
  },

}
</script>

<style>

</style>
